<template>
  <div class="lcdp_axe_main" v-show="alreadyLoad">
    <div class="lcdp_axe jxd_ins_elBaseWebPage jxd_additional GrglCs1021 hussar_0">
      <!-- 按钮 -->
      <el-button tabindex="" :disabled="button_2Disabled" ref="button_2Ref" v-show="!button_2Hidden" class="button_2 jxd_ins_elButton lay-btn button_additional default">
        <i class=""></i>
        <span>按钮</span>
      </el-button>
      <!-- 数据表格 -->
      <div v-show="!table_3Hidden" class="table_3 jxd_ins_hTableV1 lay-table default">
        <h-table-v1 :key="table_3Refresh" theme-name="default" :props="table_3PropsData" :inner-styles="table_3InnerStyles" v-loading="table_3TableLoading" :isPagination="true" @selection-change="table_3SelectRow" ref="table_3TableRef" :isUserCustom="table_3IsUserCustom" :customOptions="table_3CustomOptions" @saveCustomOptions="table_3SaveCustomOptions" @sort-change="table_3SortChange" :disabled="table_3Disabled" :data="table_3Data" :listQuery="table_3ListQuery"></h-table-v1>
        <div class="page"><el-pagination background @size-change="table_3HandleSizeChange" @current-change="table_3HandleCurrentChange" :page-size="table_3ListQuery.size" :key="table_3UpdateKey" :layout="table_3Layout" :total="table_3TableTotal" :current-page.sync="table_3ListQuery.current"></el-pagination></div>
      </div>
      <!-- 单行文本 -->
      <el-input style="display: flex" placeholder="请输入" clearable :disabled="input_4Disabled" ref="input_4Ref" :type="input_4Type" v-show="!input_4Hidden" v-model="input_4Data" class="input_4 jxd_ins_elInput lay-input default">&gt;</el-input>
    </div>
  </div>
</template>
<script>
import * as HussarRouter from '@/utils/HussarRouter';
import * as flowAuth from '@/api/bpm/flowAuth';
import { getQueryConditionsResult } from '@/pages/index/utils/lowcode/queryConditionUtils';
/* @begin definitions # 页面局部定义 */
/* @end definitions */
export default {
  name: 'GrglCs1021',
  components: {},
  data() {
    return {
      alreadyLoad: false, // 页面的alreadyLoad属性
      button_2Disabled: false, // 按钮的禁用属性
      button_2Hidden: false, // 按钮的隐藏属性
      form_1FormCheck: {}, // 表单验证属性
      form_1FormData: {}, // 表单的data变量
      input_4Data: '', // 单行文本的value变量
      input_4Disabled: false, // 单行文本的禁用属性
      input_4Hidden: false, // 单行文本的隐藏属性
      input_4Type: 'text', // 单行文本的type属性
      isFirstCreate: true, // 页面的isFirstCreate属性
      table_3Data: [], // 数据表格的value变量
      table_3Disabled: false, // 数据表格的禁用属性
      table_3Hidden: false,
      table_3Layout: 'total,prev,pager,next,sizes',
      table_3CurrentPage: 1,
      table_3UpdateKey: 0,
      table_3IsUserCustom: false,
      table_3CustomOptions: { customList: [] },
      table_3TableLoading: false,
      table_3Refresh: 0,
      table_3ListQuery: {
        current: 1,
        size: 10
      }, // 数据表格的pagination变量
      table_3PropsData: {
        needOperations: [
          {
            borderColor: 'transparent',
            color: '#2794F8',
            bg: 'transparent',
            auth: '',
            eventName: 'needOperation1',
            label: '修改'
          },
          {
            borderColor: 'transparent',
            color: '#2794F8',
            bg: 'transparent',
            auth: '',
            eventName: 'needOperation2',
            label: '删除'
          },
          {
            borderColor: 'transparent',
            color: '#2794F8',
            bg: 'transparent',
            auth: '',
            eventName: 'needOperation3',
            label: '流程图'
          },
          {
            borderColor: 'transparent',
            color: '#2794F8',
            bg: 'transparent',
            auth: '',
            eventName: 'needOperation4',
            label: '流程修改'
          },
          {
            borderColor: 'transparent',
            color: '#2794F8',
            bg: 'transparent',
            auth: '',
            eventName: 'needOperation5',
            label: '流程删除'
          }
        ],
        needOperationWidth: 390,
        showSelection: true,
        showToolbar: false,
        showCustomList: false,
        isPagination: true,
        complexFilter: false
      },
      table_3InnerStyles: {},
      table_3ReturnData: [], // 表格动作返回值
      table_3TableDataChecked: [], // 数据表格的data变量
      table_3TableTotal: 0 // 数据表格的total变量
      /* @begin data # 自定义数据属性 */
      /* @end data */
    };
  },
  computed: {
    /* @begin computed # 自定义计算属性 */
    /* @end computed */
  },
  watch: {
    /* @begin watch # 自定义侦听器 */
    /* @end watch */
  },
  methods: {
    /**
     * 表单加载
     */
    form_1FormLoad(callback, formId) {
      const self = this;
      // 表单未绑定数据模型或数据模型没有主键，该动作未成功生成
      if (callback && typeof callback === 'function') {
        callback();
      }
    },
    /**
     * 页面状态方法
     */
    hussar_0PageAllStateMe() {
      const self = this;
      if (self.hussar_0PageCommonStateMe) {
        self.hussar_0PageCommonStateMe();
      }
      if (self.hussar_0BpmStateHandler) {
        self.hussar_0BpmStateHandler();
      }
    },
    /**
     * 工作流表单权限方法
     */
    hussar_0PageRenderAllState(callBack) {
      const self = this;
      const failButContinue = true;
      flowAuth
        .getOnlineConfig()
        .then((res) => {
          if (res && res.msg === 'true') {
            // 权限查询条件
            if (self.$options.name && HussarRouter.query(self, 'processDefinitionKey')) {
              const condition = {
                formName: self.$options.name,
                processKey: HussarRouter.query(self, 'processDefinitionKey'),
                formType: HussarRouter.query(self, 'doneListIdentification'),
                taskDefinitionKey: HussarRouter.query(self, 'taskDefinitionKey')
              };
              if (HussarRouter.query(self, 'doneListIdentification') === 3) {
                // 此处生成了空方法体
              }
              // 获取该工作流相应的表单权限配置
              if (flowAuth.getAllAuthConfigs) {
                flowAuth.getAllAuthConfigs(condition).then((res) => {
                  if (res && res.data && res.data.length > 0) {
                    // 循环权限配置，查到符合当前流程节点的权限
                    res.data.forEach((auth) => {
                      if (auth.taskDefinitionKey === HussarRouter.query(self, 'taskDefinitionKey')) {
                        // 获取禁用组件
                        if (auth.insDisabled) {
                          const insDisabled = JSON.parse(auth.insDisabled);
                          if (insDisabled && insDisabled.length > 0) {
                            insDisabled.forEach((ins) => {
                              const curIns = `${ins}Disabled`;
                              self[curIns] = true;
                            });
                          }
                        }
                        // 获取隐藏组件
                        if (auth.insHidden) {
                          const insHidden = JSON.parse(auth.insHidden);
                          if (insHidden && insHidden.length > 0) {
                            insHidden.forEach((ins) => {
                              const curIns = `${ins}Hidden`;
                              self[curIns] = true;
                            });
                          }
                        }
                        // 获取无需校验组件
                        if (auth.insNotCheck) {
                          const insNotCheck = JSON.parse(auth.insNotCheck);
                          if (insNotCheck && insNotCheck.length > 0) {
                            const formCheckParam = JSON.parse(auth.formCheckParam);
                            insNotCheck.forEach((ins) => {
                              if (formCheckParam[ins] && formCheckParam[ins].formKey) {
                                const formCheckData = `${formCheckParam[ins].formKey}FormCheck`;
                                if (formCheckParam[ins].field && self[formCheckData]) {
                                  self[formCheckData][formCheckParam[ins].field] = false;
                                }
                              }
                            });
                          }
                        }
                      }
                    });
                  }
                  self.alreadyLoad = true;
                });
              }
            } else {
              // 当前页面不是工作流表单
              self.alreadyLoad = true;
            }
          } else {
            self.alreadyLoad = true;
            if (callBack && typeof callBack === 'function') {
              callBack();
            }
          }
        })
        .catch(() => {
          self.$message.error('数据请求异常');
        });
    },
    table_3ExcelDownloadForArea(colIndex) {
      const self = this;
      const ordA = 'A'.charCodeAt(0);
      const ordZ = 'Z'.charCodeAt(0);
      const len = ordZ - ordA + 1;
      let str = '';
      while (colIndex >= 0) {
        str = String.fromCharCode((colIndex % len) + ordA) + str;
        colIndex = Math.floor(colIndex / len) - 1;
      }
      return str;
    },
    table_3ExcelExportForArea(colIndex) {
      const self = this;
      const ordA = 'A'.charCodeAt(0);
      const ordZ = 'Z'.charCodeAt(0);
      const len = ordZ - ordA + 1;
      let str = '';
      while (colIndex >= 0) {
        str = String.fromCharCode((colIndex % len) + ordA) + str;
        colIndex = Math.floor(colIndex / len) - 1;
      }
      return str;
    },
    /**
     * 数据表格的获取筛选参数方法
     */
    table_3GetQueryConditions(params) {
      const self = this;
      const queryConditionsFields = [];
      return getQueryConditionsResult({
        queryConditionsFields,
        params,
        filterConfig: self.table_3PropsData.filterConfig
      });
    },
    /**
     * 数据表格的处理当前更改方法
     */
    table_3HandleCurrentChange(currentPage) {
      const self = this;
      self.table_3ListQuery.current = currentPage;
      const { orders } = self.table_3ListQuery;
      if (orders && orders.length > 0) {
        self.table_3TableLoadByOrderDy();
      } else {
        self.table_3TableLoad();
      }
    },
    /**
     * 数据表格的处理大小更改方法
     */
    table_3HandleSizeChange(pageSize) {
      const self = this;
      self.table_3ListQuery.size = pageSize;
      const { orders } = self.table_3ListQuery;
      const totalNum = self.table_3ListQuery.current * self.table_3ListQuery.size;
      if (self.table_3TableTotal && self.table_3TableTotal < totalNum) {
        self.table_3ListQuery.current = Math.floor(self.table_3TableTotal / self.table_3ListQuery.size) + 1;
      }
      if (orders && orders.length > 0) {
        self.table_3TableLoadByOrderDy();
      } else {
        self.table_3TableLoad();
      }
    },
    table_3SaveCustomOptions(customOptions) {
      const self = this;
      this.table_3IsUserCustom = true;
      const oldPageType = this.table_3CustomOptions.pageType;
      const newPageType = customOptions.pageType;
      this.table_3CustomOptions = customOptions;
    },
    /**
     * 数据表格的选择行数据方法
     */
    table_3SelectRow(data) {
      const self = this;
      self.table_3TableDataChecked = [];
      data.forEach((item) => {
        self.table_3TableDataChecked.push(item);
      });
    },
    /**
     * 数据表格的全局排序方法
     */
    table_3SortChange(val) {
      const self = this;
      self.table_3ListQuery.orders = [];
      const isNull = val.order === null;
      if (!isNull) {
        const orders = [];
        const isAsc = val.order === 'ascending';
        let order = {};
        // order.column = self.table_3ToLine(val.prop);
        order.column = val.prop;
        order.asc = isAsc;
        orders.push(order);
        this.table_3ListQuery.orders = orders;
      }
      let columns = self.$refs.table_3TableRef.$refs.hTable.columns;
      let { order } = val;
      columns.forEach((column) => {
        column.order = null;
        if (column.property === val.prop) {
          column.order = order;
        }
      });
      self.table_3TableLoadByOrderDy();
    },
    /**
     * 数据表格的表格初始化方法
     */
    table_3TableInit() {
      const self = this;
      self.table_3TableLoad();
    },
    /**
     * 数据表格的表格加载方法
     */
    table_3TableLoad(callback) {
      const self = this;
      if (callback && typeof callback === 'function') {
        callback();
      }
    },
    /**
     * 数据表格的表格排序加载方法
     */
    table_3TableLoadByOrderDy(callback) {
      const self = this;
      if (callback && typeof callback === 'function') {
        callback();
      }
    }
    /* @begin methods # 自定义方法 */
    /* @end methods */
  },
  created() {
    const self = this;
    // @begin created:before # 自定义创建钩子头部
    // @end created:before
    self.hussar_0PageRenderAllState();
    // @begin created:after # 自定义创建钩子尾部
    // @end created:after
  },
  async mounted() {
    const self = this;
    // @begin mounted:before # 自定义挂载钩子头部
    // @end mounted:before
    if (self.$compilationMetadata.strategy) {
      window.curPageSelfFresh = function () {
        if (self.hussar_0Activated) {
          self.hussar_0Activated && self.hussar_0Activated();
        }
      };
    }
    // @begin mounted:after # 自定义挂载钩子尾部
    // @end mounted:after
  },
  filters: {},
  destroyed() {
    const self = this;
    // @begin destroyed:before # 自定义销毁钩子头部
    // @end destroyed:before
    // @begin destroyed:after # 自定义销毁钩子尾部
    // @end destroyed:after
  },
  activated() {
    const self = this;
    // @begin activated:before # 自定义组件激活钩子头部
    // @end activated:before
    // @begin activated:after # 自定义组件激活钩子尾部
    // @end activated:after
  },
  beforeRouteUpdate(to, from, next) {
    const self = this;
    next();
    if (to.query && to.query.systemParams && JSON.parse(to.query.systemParams).refresh === 1) {
      if (self.hussar_0Activated) {
        self.hussar_0Activated && self.hussar_0Activated();
      }
    }
  },
  deactivated() {
    const self = this;
    // @begin deactivated:before # 自定义组件失活钩子头部
    // @end deactivated:before
    // @begin deactivated:after # 自定义组件失活钩子尾部
    // @end deactivated:after
  }
  /* @begin options # 自定义页面组件创建选项 */
  /* @end options */
};
</script>
<!-- @begin style:before # 自定义 style 代码块（较低优先级） -->
<!-- @end style:before -->
<style scoped>
/*公共，用于固定*/
.lcdp_axe_main {
  transform: scale(1);
  height: 100%;
  overflow: auto;
}
/*公共，用于设置文字提示的最大宽度*/
.el-tooltip__popper {
  max-width: 500px;
}
.GrglCs1021.hussar_0 {
  width: calc(100% - 0px - 0px);
  top: 0;
  position: relative;
  left: 0;
  height: 100%;
  display: block;
}
.lcdp_axe.GrglCs1021 .button_2 {
  top: 84px;
  position: absolute;
  left: 242px;
  display: block;
}
.lcdp_axe.GrglCs1021 .button_2 {
  margin-left: 0;
}
.lcdp_axe.GrglCs1021 .button_2 /deep/ span i {
  font-weight: normal;
}
.lcdp_axe.GrglCs1021 .form_1 {
  top: 0;
  position: absolute;
  left: 0;
  display: block;
}
.lcdp_axe.GrglCs1021 .input_4 {
  top: 94px;
  position: absolute;
  left: 413px;
  display: block;
}
.lcdp_axe.GrglCs1021 .input_4 /deep/ .el-input__suffix {
  width: 0px;
  justify-content: flex-end;
  align-items: center;
}
.lcdp_axe.GrglCs1021 .input_4 /deep/ .el-input__suffix .el-input__suffix-inner {
  flex-direction: row-reverse;
}
.lcdp_axe.GrglCs1021 .input_4 /deep/ .el-input__inner::-ms-reveal {
  display: none;
}
.lcdp_axe.GrglCs1021 .input_4 /deep/ .el-input__clear {
  position: absolute;
}
.lcdp_axe.GrglCs1021 .input_4 /deep/ .el-input__clear {
  left: -15px;
}
.lcdp_axe.GrglCs1021 .input_4 /deep/ .el-input__clear {
  display: flex;
}
.lcdp_axe.GrglCs1021 .input_4 /deep/ .el-input__clear {
  align-items: center;
}
.lcdp_axe.GrglCs1021 .table_3 {
  width: calc(100% - 20px - 20px);
  top: 151px;
  right: 20px;
  position: absolute;
  left: 20px;
  display: block;
}
.lcdp_axe.GrglCs1021 .table_3 /deep/ th.gutter {
  display: none;
}
.lcdp_axe.GrglCs1021 .table_3 /deep/ ::-webkit-scrollbar {
  height: 16px;
  width: 16px;
}
.lcdp_axe.GrglCs1021 .table_3 /deep/ .page .el-pagination .el-select .el-input {
  width: auto;
}
.lcdp_axe.GrglCs1021 .table_3 /deep/ .page .el-pagination .el-select .el-input .el-input__inner {
  max-width: 90px;
}
.lcdp_axe.GrglCs1021 .table_3 /deep/ .page .el-pagination .el-pagination__jump .el-input .el-input__inner {
  vertical-align: middle;
}
.lcdp_axe.GrglCs1021 .table_3 /deep/ .el-table__fixed::before,
.el-table__fixed-right::before {
  content: none;
}
.lcdp_axe.GrglCs1021 .table_3 /deep/ .el-table__fixed-footer-wrapper {
  bottom: -1px;
}
.lcdp_axe.GrglCs1021 .table_3 /deep/ .el-table__body tr.current-row > td {
  border-top: 1px solid transparent;
}
.jxd_hyperlinks_span {
  color: rgb(58, 142, 230);
  cursor: pointer;
}
</style>
<style></style>
<!-- @begin style:after # 自定义 style 代码块（较高优先级） -->
<!-- @end style:after -->
